<template>
  <view>
    <uni-popup ref="popupcancel" type="center" :mask-click="false">
      <view class="cancel-order">
        <image src="https://jinlin-airobot.oss-cn-shenzhen.aliyuncs.com/host/app_static/popup/detention_v1.png" mode="aspectFill "></image>
        <view class="close" @click="$refs.popupcancel.close()">
          <image src="https://jinlin-airobot.oss-cn-shenzhen.aliyuncs.com/host/app_static/popup/cancel.png"></image>
        </view>
        <view class="postion-btn">
          <view class="btn-experie"  @click="affirmBtn">
            <view>立即体验</view>
            <view class="dot"></view>
          </view>
        </view>
      </view>
    </uni-popup>
  </view>
</template>

<script>
  export default {
  	data() {
  		return {}
    },
    methods:{
      // 返回确认事件
      affirmBtn() {
        this.$emit("affirmClick")
      },
      getPopupOpen() {
        this.$refs.popupcancel.open()
      },
      getPopupConcal() {
        this.$refs.popupcancel.close()
      }
    },
  }
</script>

<style lang="scss" scoped>
  image{
    width: 100%;
    height: 100%;
  }
    .cancel-order{
      width: 614rpx;
      height: 732rpx;
      position: relative;
     .close{
       width: 48rpx;
       height: 48rpx;
       position: absolute;
       top: 40rpx;
       right: 12rpx;
      }
      .postion-btn{
        position: absolute;
        left: 0;
        right: 0;
        bottom: 64rpx;
        display: flex;
        justify-content: center;
        .btn-experie{
          width: 424rpx;
          height: 72rpx;
          background: #FF800C;
          border-radius: 36rpx;
          color: #FFFFFF;
          font-weight: bold;
          font-size: 28rpx;
          letter-spacing: 0.2em;
          display: flex;
          align-items: center;
          justify-content: center;
          position: relative;
          .dot{
            width: 12rpx;
            height: 12rpx;
            background: rgba(255, 255, 255, 0.8);
            border-radius: 50%;
            position: absolute;
            top: 12rpx;
            right: 27rpx;
          }
        }
      }
    }
</style>
